.markdown-body {
  box-sizing: border-box;
  min-width: 200px;
  max-width: 980px;
  margin: 0 auto;
  padding: 4px;
}
.slider {
  position: fixed;
  top: 2rem;
  bottom: 0;
  left: 1rem;
  height: 100vh;
  overflow: auto;
}

@media (max-width: 767px) {
  .markdown-body {
    padding: 15px;
  }
  .ant-layout-sider-zero-width-trigger {
    top: 0.6rem;
    left: -1rem;
  }
  .slider {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0.6rem;
    height: 100vh;
    overflow: unset;
  }
}

.ant-layout-sider-zero-width-trigger {
  top: 0.6rem;
  left: -1rem;
}

.layout {
  background-color: #fff;
  .ant-layout-header {
    padding: 0;
  }
  .header {
    position: relative;
    z-index: 10;
    max-width: 100%;
    background: #fff;
    box-shadow: 0 2px 8px #f0f1f2;
    .logo {
      height: 32px;
      margin-right: 12px;
      padding-left: 44px;
      color: #000000d9;
      font-weight: 500;
      vertical-align: middle;
      border-style: none;
    }
    .row {
      height: 64px;
    }
    h1 {
      margin-bottom: 0;
    }
  }
  .layout-content {
    margin-top: 2rem;
    .slider-left {
      max-height: 100vh;
      overflow: hidden;
      border-right: 1px solid rgba(0, 0, 0, 0.06);
      .ant-menu-item a {
        color: #000000d9;
      }
      .menu-item li span {
        padding-left: 1.6rem;
        color: #000000d9;
      }
    }
    .content {
      padding: 2rem;
      background-color: #fff;
    }
  }
}
